<section id = "doc_viewport-configuration" data-view = "true" data-view-title = "视图配置">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>视图配置</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<p>通常情况下，一个视图的功能表现是固定的。但在部分场景下，视图可能需要同时包含多种功能表现，并需要以配置的方式指定要启用的功能表现。在这种情况下，就可以借助视图配置完成。</p>
		<p>视图配置是一个集合，可以根据程序需要包含多个配置项。每个配置项由"配置项名称"和"配置项取值"两部分组成。除此之外，为方便开发者，视图配置项还提供有<span class = "code js">apply()</span>及<span class = "code js">reflectToDom()</span>等方法。如：</p>
		<div class = "code js">
var view = View.ofId("myView");
var a = view.config.get("config-item");
var b = view.config.get("config-item");
console.log(a === b);//-> true
a.setValue(123);//-> set value to 123
console.log(b.getValue());//->123
b.apply();//-> nothing happes
b.setApplication(function(v){
    console.log(123, v);
});
b.setValue("asdf");//-> nothing happens
console.log(b.getValue());//-> 123
b.setValue("asdf", true);//-> set value to ‘asdf’
b.apply();//-> 123, asdf
		</div>

		<p>开发者可以通过<span class = "code js">reflectToDom()</span>方法将配置项取值体现到DOM中，从而可以在CSS层面控制元素的表现。<span class = "code js">reflectToDom()</span>方法被调用时，将配置项以<span class = "code html">data-viewconfig_[configName]=[configValue]</span>的形式添加至视图的DOM结点上。如：</p>

		<div class = "code js">
View.ofId("myView").config.get("show-header").setValue(true).reflectToDom();
		</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>